<template>
  <div>
    <job-header></job-header>
    <job-search :jobs="jobs"></job-search>
    <job-list :hotJobs="hotJobs" :jobs="jobs"></job-list>
  </div>
</template>

<script>
// import ApiUrl from '@/config/api_url'
import axios from 'axios'
import JobHeader from './components/Header'
import JobSearch from './components/Search'
import JobList from './components/List' 

export default {
  name: 'Job',
  components: {
    JobHeader, JobSearch, JobList
  },
  data () {
    return {
      hotJobs: [],
      jobs: {},
      // letter: ''
    }
  },
  methods: {
    getCityInfo () {
      // axios.get(ApiUrl.api + 'city.json?city=')
      //   .then(this.handleGetCityInfoSucc)
      axios.get('/api/job.json')
        .then(this.handleGetJobInfoSucc)
    },
    handleGetJobInfoSucc (res) {
        // console.log(res)
      if (res.status == 200 && res.data) {
        this.hotJobs = res.data.hotJobs
        this.jobs = res.data.jobs
      }
    },
    handleLetterChange (letter) {
      this.letter = letter
    }
  },
  mounted () {
    this.getCityInfo()
  }
}
</script>

<style lang="scss" scoped>

</style>
